<template>
  <div>
    <r-search :searchHandle="searchHandleAdd" />
    <r-table :isSelection="true" :isPagination="true" :tableData="tableData" :tableCols="tableCols"
      :tablePage="tablePage" @refresh="init()"></r-table>
    <r-form :formRules="formRules" :formHandle="formHandle" :formData="formData"
      :formCols="formCols" ref="elForm" labelWidth="200px" dialogWidth="1000px" :isHandle="true" />
  </div>
</template>
<script>
export default {
  data() {
    return {

      searchHandleAdd: [
        {
          label: "创建分类",
          type: "success",
          handle: e => this.elFormVisible()
        },
      ],

      tableData: [
      ],
      tableCols: [
        {
          label: 'ID',
          prop: 'id',
          // theme: e => e.status ? 'primary' : 'danger', type: "tag",
        },
        {
          label: '分类名称',
          prop: 'name'
        },
        {
          label: '分类图片',
          prop: 'img',
          type: 'image'
        },
        {
          label: '分类简介',
          prop: 'brief'
        },
        {
          label: '新增时间',
          prop: 'ctime',
          width: 160
        },
        {
          label: '操作',
          type: "button",
          width: 200,
          btnList: [
            {
              label: '编辑',
              type: 'primary',
              size: 'mini',
              // isShow: e => e.orderId == '123' ? true : false,
              handle: (row) => this.elFormDetail(row)
            },
            {
              label: '删除',
              type: 'danger',
              size: 'mini',
              handle: (row) => this.TableDel('/sys/goodsCategory/delete', { id: row.id }),
            },
          ]
        }

      ],
      tablePage: { limit: 10, page: 1, total: 0 },
      formData: {
        name: '',
        brief: "",
        categoryId: "",
        type: "",
        costPrice: "",
        price: "",
        img: "",
        goodsDetails: "",
        status: ""
      },
      formCols: [
        { type: "input", label: "分类名称", width: 450, prop: "name", },
        { type: "upload", label: "分类图片", width: 200, prop: "img", remark: '只能上传jpg/png/MP4格式文件，文件不能超过500kb', rmblock: true, success: (res, file) => { this.$refs.elForm.loading = false; this.formData.img = res.data.imgPath } },
        { type: "input", label: "分类简介", width: 450, prop: "brief", },
      ],
      formRules: {
        name: [
          { required: true, message: '请输入分类名称', trigger: 'blur' },
        ],
        img: [
          { required: true, message: '请输入分类简介', trigger: 'blur' },
        ],
        brief: [
          { required: true, message: '请输入分类分类', trigger: 'blur' },
        ],
      },
      formHandle: [
        {
          label: "取消",
          handle: e => this.elFormVisible(),
        },
        {
          label: "确定",
          type: "success",
          handle: e => this.elFormSubmit(),
        },

      ],
    };
  },
  components: {},
  computed: {},
  mounted() {
    this.init()
  },
  methods: {
    async init() {
      let parm = { ...this.tablePage, ...this.searchData }
      let res = await this.api.goodscfylist(parm)
      if (res) {
        this.tablePage.total = res.data.total
        this.tableData = res.data.list
      }

    },
    async elFormSubmit(row) {
      // console.log(row);
      if (row) {
        await this.api.goodsupdate(row)
      } else {
        let res = null
        if (this.formData.id) {
          res = await this.api.goodscfyupdate(this.formData) //advertsave
        } else {
          res = await this.api.goodscfyadd(this.formData)
        }
        if (res) {
          this.elFormVisible()
          this.init()
        }
      }

    },
    elFormDetail(row) {
      Object.keys(this.formData).forEach(key => {
        this.formData[key] = row[key]
      })
      this.formData.id = row.id;
      // if (this.formCols[1].label == '登录密码') {
      //     this.formCols.splice(1, 1)
      // }

      this.elFormVisible()
    },
  }
};
</script>
<style scoped lang='scss'>
.el-icon-search {
  margin-right: 10px;
}
.Tip {
  margin-left: 20px;
}
</style>
